<template>
	<view>
		<view class="stygap">
			<view class="stygap_da">
				<view style="position: relative;top: 20rpx;">
					<image src="../../static/index_tejia.png" style="width: 422rpx;height: 50rpx;margin-left: 164rpx;">
					</image>
					<image @tap="closeDialog3()" src="../../static/quxiao_yuan.png"
						style="margin-left: 84rpx; width: 50rpx;height: 50rpx;"></image>
				</view>
				<view v-for="item in tejia" style="display: inline-block;margin-left: 28rpx;">
					<image :src="item.tubiao" mode=""
						style="width: 332rpx;height: 437rpx;display: inline-block;margin-top: 28rpx;"></image>
					<!-- 抵用券价格 -->
					<view style="position: absolute;margin-top: -422rpx;margin-left:20rpx;">
						<text
							style="font-size: 35rpx;color: rgba(250, 18, 22, 1);font-weight: bold;">{{item.values}}</text>
						<text style="font-size: 24rpx;color: rgba(250, 18, 22, 1);margin-left: 5rpx;">元</text>
					</view>
					<!-- 抵用券折扣价 -->
					<view v-show="level_grade!==10000"
						style="position: absolute;margin-top: -130rpx;margin-left: 37rpx;">
						<image src="../../static/tejiak.png" mode="" style="width: 251rpx;height: 51rpx;"></image>
						<view style="margin-top: -55rpx;position: relative;margin-left: 42rpx;">
							<text style="font-size: 24rpx;font-weight: bold;color: rgba(240, 27, 38, 1);">特价：</text>
							<text
								style="font-size: 24rpx;font-weight: bold;color: rgba(240, 27, 38, 1);">￥{{item.vip_price}}</text>
						</view>
					</view>
					<view
						style="position: absolute;display: flex;justify-content: space-between;margin-top: -64rpx;margin-left: 11rpx;">
						<text v-show="level_grade!==10000"
							style="font-size: 25rpx;color: rgba(204, 204, 204, 1);text-decoration: line-through;margin-right: 18rpx;">￥{{item.user_price}}</text>
						<text v-show="level_grade==10000"
							style="font-size: 25rpx;color: rgba(204, 204, 204, 1);margin-right: 18rpx;">￥{{item.user_price}}</text>
						<view style="margin-top: -10rpx;" @tap="gomaiq(item.id)">
							<image src="../../static/gomaik.png" mode="" style="width: 174rpx;height: 61rpx;">
							</image>
							<view style="position: relative;margin-left: 32rpx;margin-top: -61rpx;">
								<text
									style="font-size: 31rpx:;rpx;font-weight: bold;color: rgba(255, 255, 255, 1);">立即购买</text>
							</view>
						</view>
					</view>
				</view>

			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: 'graceTanKuang',
		props: ['tejia'],
		data() {
			return {
				level_grade: '',
			}
		},
		created() {
			var user = uni.getStorageSync('storage_key');
			this.level_grade = user.level_grade
		},
		methods: {
			// 抵用券立即购买跳转页面事件
			gomaiq(id) {
				this.closeDialog3();
				uni.navigateTo({
					url: '/pages/index/buy_coupons?coupons_id=' + id
				})
				console.log(this.show3);
				this.$emit('gomaiq')
			},
			closeDialog3: function() {
				this.show3 = false;
				this.$emit('closeDialog3')
			},
		}
	}
</script>

<style scoped>
	.stygap {
		width: 750rpx;
		height: 1030rpx;
		background: rgba(255, 234, 169, 1);
		border-radius: 20rpx 20rpx 0px 0px;
		margin-bottom: 10rpx;
	}

	.stygap_da {
		position: relative;
		bottom: 10rpx;
		width: 750rpx;
		height: 1030rpx;
		background: rgba(255, 234, 169, 1);
		border-radius: 20rpx 20rpx 0px 0px;
	}
</style>
